<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<script>
		/* 	//----------  replace方法--------------------------
			let str = 'ABAPgit客户端aaaaa'
			let keyword = 'a'
			// replace方法参数一可以写正则   g 全局查找  i 忽略大小写
			const res = str.replace(/keyword/gi, '<span style="color: red;">a</span>')
			console.log(res);
			document.body.innerHTML = res */
			// 以上实现方式有瑕疵
			// 1. 不能区分处理大小问题
			// 2. //正则不能匹配变量

		let str = 'XXXXXBAPxxxxgit客户端aaaaa'
		let keyword = 'x'
    //  []  new Array() {} new Object  //-字面量正则  new RegExp()
		// 这也是声明正则表达式的方式 ()内参数一既支持字符串也支持变量, 参数2是匹配规则
	  const reg = new RegExp(keyword, 'gi') // 使用内置构造函数创建正则的方式
		console.log(reg); // /a/gi 
		// replace方法参数二可以写替换的字符, 也可以写一个函数, 函数中参数是匹配到的字符,函数必须有返回值
		const res = str.replace(reg, (val)=>{
			console.log(val); // 匹配到的字符串的字符
			return `<span style="color: red;">${val}</span>`
		} )
		document.body.innerHTML = res
	</script>
</body>

</html>